<!DOCTYPE html>
<html lang="en">
  <head>
		<?php include("view/head.php"); ?>
  </head>
  <body>
	<?php include("view/main-menu.php"); ?>	
	<div class="header">
		<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
		<!-- Indicators -->
			<ol class="carousel-indicators">
				<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
				<li data-target="#carousel-example-generic" data-slide-to="1"></li>
				<li data-target="#carousel-example-generic" data-slide-to="2"></li>
			</ol>
		<!-- Head Search -->
		<div class="search">
			<div class="row2">
				<div class="container2">
					<div class="row">
						<div class="col-md-12">
							<div class="row">
								<h2>Find a place to stay. </h2>
								<p>Rent from people in over 34,000 cities and 190 countries.</p>
							</div>
							<div class="row">
								<form action="hochiminh.php" id="search_form" class="custom show-search-options position-left form-inline">
									<div class="input-wrapper">
										<input type="text" class="location input-large" autocomplete="off" id="location" name="location" placeholder="Where do you want to go?">
									</div>
									<div id="checkinWrapper" class="input-wrapper">
										<input type="text" id="checkin" class="checkin input-large ui-datepicker-target" name="checkin" placeholder="Check in">
										<span class="search-area-icon"></span>
									</div>
									<div id="checkoutWrapper" class="input-wrapper">
										<input type="text" id="checkout" class="checkout input-large ui-datepicker-target" name="checkout" placeholder="Check out">
										<span class="search-area-icon search-area-icon-checkout"></span>
									</div>
									<div class="input-wrapper">
										<div class="select select-large">
											<select id="guests" name="guests" class="search-option small">
												<option value="1">1 Guest</option>
												<option value="2">2 Guests</option>
												<option value="3">3 Guests</option>
												<option value="4">4 Guests</option>
												<option value="5">5 Guests</option>
												<option value="6">6 Guests</option>
												<option value="7">7 Guests</option>
												<option value="8">8 Guests</option>
												<option value="9">9 Guests</option>
												<option value="10">10 Guests</option>
												<option value="11">11 Guests</option>
												<option value="12">12 Guests</option>
												<option value="13">13 Guests</option>
												<option value="14">14 Guests</option>
												<option value="15">15 Guests</option>
												<option value="16">16+ Guests</option>
											</select>
										</div>
									</div>
									<button type="submit" class="btn btn-primary btn-large btn-contrast" id="submit_location">Search </button>
								</form>
							</div>		
  						</div>
					</div>
				</div>
			</div>
		</div>	
		<!-- Wrapper for slides -->
		<div class="carousel-inner">
			<div class="item active">
				<img src="images/1.jpg">
				<div class="carousel-caption">
					caption 1
				</div>
			</div>
			<div class="item">
				<img src="images/2.jpg">
				<div class="carousel-caption">
					caption 2
				</div>
			</div>
			<div class="item">
				<img src="images/3.jpg">
				<div class="carousel-caption">
					caption 3
				</div>
			</div>
 
		</div>

		<!-- Controls -->
		<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
			<span class="glyphicon glyphicon-chevron-left"></span>
		</a>
		<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
			<span class="glyphicon glyphicon-chevron-right"></span>
		</a>
		</div>
	</div>
	<div class="main">
		<div class="main-container">
			<div class="row">
				<h1>Neighborhood Guides</h1>
				<br>
				<p>Not sure where to stay? We've created neighborhood guides for cities all around the world.
				</p>
			</div>
		
			<div class="row">
				<div class="col-sm-6 col-md-4">
					<div class="thumbnail noborder">
						<img src="images/11.jpg"/>
					</div>
				</div>
				<div class="col-sm-6 col-md-4">
					<div class="thumbnail noborder">
						<img src="images/11.jpg"/>
					</div>
				</div>
				<div class="col-sm-6 col-md-4">
					<div class="thumbnail noborder">
						<img src="images/11.jpg"/>
					</div>
				</div>
			</div>
			<br>
			<div class="row">
				<div class="col-sm-6 col-md-4">
					<div class="thumbnail noborder">
						<img src="images/11.jpg"/>
					</div>
				</div>
				<div class="col-sm-6 col-md-4">
					<div class="thumbnail noborder">
						<img src="images/11.jpg"/>
					</div>
				</div>
				<div class="col-sm-6 col-md-4">
					<div class="thumbnail noborder">
						<img src="images/11.jpg"/>
					</div>
				</div>
			</div>
		</div>
	</div>
	<hr class="line"></hr>
	
	<?php include("view/footer.php"); ?>
	
	
	

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="js/jquery-1.11.1.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>